<!--
 * @Description  : 
 * @Autor        : guoxi
 * @Date         : 2022-08-16 20:11:00
 * @LastEditors  : 
 * @LastEditTime : 2022-08-16 20:11:00
 * @FilePath     : \rpms\src\views\funds\project-funds\detail\index.vue
-->
<template>
  <el-card>
    <el-page-header content="项目经费详情" @back="handleBack" />
  </el-card>
  <br />
  <el-card>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="预算执行表" name="first">
        <ExecutionTable v-if="activeName === 'first'" />
      </el-tab-pane>
      <el-tab-pane label="经费支出填报" name="second">
        <ExpenditureTable v-if="activeName === 'second'" />
      </el-tab-pane>
    </el-tabs>
  </el-card>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
import ExecutionTable from "./components/ExecutionTable.vue";
import ExpenditureTable from "./components/ExpenditureTable.vue";

const router = useRouter();
const activeName = ref("first");

const handleClick = (tab, event) => {
  console.log(tab, event);
};

const handleBack = () => {
  router.push("/funds/project-funds");
};
</script>

<style lang="scss" scoped></style>
